<template>
  <div>
    <a-input-search
      v-model="textVals"
      placeholder="请选择供应商"
      readOnly
      unselectable="on"
      @search="onSearchSuppliers"
    >
      <a-button slot="enterButton">选择供应商</a-button>
    </a-input-search>

    <erp-goods-supplier-list-modal ref="goodsSupplierListModal" :modal-width="modalWidth" @supplierOk="selectOK" :materialId="this.materialId" />
  </div>
</template>
<script>
import { text } from '../formdesigner/components/custom/items/text'
import ErpGoodsSupplierListModal from './modal/ErpGoodsSupplierListModal.vue'

export default {
  components: { ErpGoodsSupplierListModal },
  props: {
    modalWidth: {
      type: Number,
      default: 1250,
      required: false,
    },
    materialId: {
      type: String,
    },
  },
  comments: {},
  data() {
    return {
      textVals: '',
    }
  },
  methods: {
    onSearchSuppliers() {
      this.$refs.goodsSupplierListModal.showModal()
    },
    selectOK(rows) {
      this.textVals = ''
      if (rows) {
        this.textVals = rows.name
        this.$emit('onSuppliersSelected', rows)
      }
    },
  },
}
</script>
